let path = require('path')
let HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
    entry:['./src/js/index.js','./src/index.html'],
    output:{
        path:path.resolve(__dirname,'dist'),
        filename:'./js/bundle.js'
    },
    module:{
        rules:[
            {
                test:/\.less$/,
                loader:['style-loader','css-loader','less-loader']
            },
            //eslint
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'eslint-loader',
                enforce:'pre',
                options: {
                    fix:true
                },
            },
            //babel
            {
                test: /\.js$/,
                exclude: /(node_modules)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: [
                            [
                                '@babel/preset-env',
                                {
                                    useBuiltIns:'usage',
                                    corejs:{version:3}, //解决找不到core-js的问题
                                    targets:{
                                        "chrome":"58",
                                        "ie":"9"
                                    }
                                }
                            ]
                        ],
                        cacheDirectory:true  //开启缓存
                    }
                }
            },
            //url-loader
            {
                test:/\.(png|jpg|gif)$/,
                use:[
                    {
                        loader:'url-loader',
                        options:{
                            limit:8192,
                            publicPath:'images/',//决定文件的查找路径
                            outputPath:'images', //输出的文件夹
                            name:'[hash:8].[ext]'
                        }
                    }
                ]
            },
            //html-loader
            {
                test:/\.html$/,
                use:{
                    loader:'html-loader'
                }
            },
            //file-loader
            // {
            //     test:/.\(eot|svg|woff|woff2|ttf|mp3|mp4|avi)$/,
            //     loader:'file-loader',
            //     options:{
            //         outputPath:'media',
            //         name:'[hash:8].[ext]'
            //     }
            // }
        ]
    },
    plugins:[
        new HtmlWebpackPlugin({
            template:'./src/index.html'
        })
    ],
    mode:"development",
    //配置自动化编译,需要在package.json中配置快捷键 "start":"webpack-dev-server"
    devServer:{
        contentBase:path.join(__dirname,'dist'),
        open:true,//自动打开浏览器
        compress:true,//启动gzip压缩
        port:3000,
        hot:true  //开启HMR
    },
    devtool:'cheap-module-eval-source-map'
}